<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
	
</script>
</head>
<body>
 		<div class="page-bar">
			<ul class="page-num-ul clearfix">
				<li>共&nbsp;${pageSupport.totalCount}&nbsp;条记录
					&nbsp;<span id="currPageNo">${pageSupport.currPageNo}</span>&nbsp;
					/
					&nbsp;<span id="totalPage">${pageSupport.totalPage}</span>&nbsp;页</li>&nbsp;&nbsp;
					<a href="javaScript:void(0);" >首页</a>
					<a href="javaScript:void(0);" >上一页</a>
					<a href="javaScript:void(0);" >下一页</a>
					<a href="javaScript:void(0);" >最后一页</a>
				&nbsp;&nbsp;	每页<select name="currentPageSize" id="currentPageSize">
						<option value="3" <c:if test="${pageSupport.pageSize == 3 }" > selected </c:if>>3</option>
						<option value="5" <c:if test="${pageSupport.pageSize == 5 }" > selected </c:if>>5</option>
						<option value="10" <c:if test="${pageSupport.pageSize == 10 }" > selected </c:if>>10</option>
					</select>条
					根据<select name="currentOrderBy" id="currentOrderBy">
						<option value="id" <c:if test="${pageSupport.orderBy == 'id' }" > selected </c:if>> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;id </option>
						<option value="creationDate" <c:if test="${pageSupport.orderBy == 'creationDate' }" > selected </c:if>>创建时间</option>
					</select>
					<select name="currentAscOrDesc" id="currentAscOrDesc">
						<option value="asc" <c:if test="${pageSupport.ascOrDesc == 'asc' }" > selected </c:if>>升序</option>
						<option value="desc" <c:if test="${pageSupport.ascOrDesc == 'desc' }" > selected </c:if>>降序</option>
					</select>查询
			</ul>
		 <span class="page-go-form"><label>跳转至</label>
	     <input type="text" name="inputPage" id="inputPage" class="page-key" />页
	     <button type="button" class="page-btn" >GO</button>
		</span>
		</div> 
</body>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.8.3.min.js" ></script>
<script type="text/javascript">

    $(function() {
		//分页跳转
		//首页
		$(".page-num-ul  a:eq(0)").click(function(){
			//获取id为pageNo的input标签，并给value属性赋值
			// $("#pageNo").val(1);
			//获取表单，并给表单总name为pageNo的input标签赋值
			document.forms[0].pageNo.value = 1;
			$("#searchForm").submit();
		});

		// 上一页
		$(".page-num-ul  a:eq(1)").click(function(){
			// $("#pageNo").val(parseInt($("#currPageNo").text()) - 1);
			document.forms[0].pageNo.value = parseInt($("#currPageNo").text()) - 1;
			$("#searchForm").submit();
		});


		// 下一页
		$(".page-num-ul  a:eq(2)").click(function(){
			// $("#pageNo").val(parseInt($("#currPageNo").text()) + 1);
			document.forms[0].pageNo.value = parseInt($("#currPageNo").text()) + 1;
			$("#searchForm").submit();
		});

		// 尾页
		$(".page-num-ul  a:eq(3)").click(function(){
			// $("#pageNo").val(parseInt($("#totalPage").text()));
			document.forms[0].pageNo.value = parseInt($("#totalPage").text());
			$("#searchForm").submit();
		});

		//上一页，下一页隐藏处理
		if($("#currPageNo").text() == "1"){
			//alert($("#currPageNo").text());
			$(".page-num-ul  a:eq(1)").hide();
		}else {
			$(".page-num-ul  a:eq(2)").show();
		}

		if($("#currPageNo").text() == $("#totalPage").text()){
			//alert($("#currPageNo").text());
			$(".page-num-ul  a:eq(2)").hide();
					//.css("display","none");
		}else {
			//alert($("#currPageNo").text());
			$(".page-num-ul  a:eq(2)").show();
					//.css("display","inline");
		}

		//修改每页页面大小 重新查询
		$("#currentPageSize").change(function(){
			//获取修改后的 currentPageSize
			var currentPageSize = $(this).children('option:selected').val();
			//alert(currentPageSize);
			//修改提交表单的pageSize
			// $("#pageSize").val(currentPageSize);
			document.forms[0].pageSize.value = currentPageSize;
			//修改页面大小后，再主动查询一次动漫数据
			//将当前页数，重置为1
			// $("#pageNo").val(1);
			document.forms[0].pageNo = 1;
			$("#searchForm").submit();
		});

		//跳到指定页数
		$(".page-btn").click(function () {
			var $inputPage = $("#inputPage");
			if($inputPage.val() < 0  || $inputPage.val() > parseInt($("#totalPage").text())){
				alert("请输入正确的页数！！！");
			}else{
				//修改表单中的当前页
				// $("#pageNo").val($inputPage.val());
				document.forms[0].pageNo.value = $inputPage.val();
				$("#searchForm").submit();
			}
		});

		//修改查询条件
		$("#currentOrderBy").change(function(){
			//获取修改后的 currentOrderBy
			var currentOrderBy = $(this).children('option:selected').val();
			//修改提交表单的orderBy
			// $("#orderBy").val(currentOrderBy);
			document.forms[0].orderBy.value =  currentOrderBy;
			//修改页面大小后，再主动查询一次动漫数据
			//将当前页数，重置为1
			// $("#pageNo").val(1);
			document.forms[0].pageNo.value = 1;
			$("#searchForm").submit();
		});

		//升序或降序
		$("#currentAscOrDesc").change(function(){
			//获取修改后的 currentAscOrDesc
			var currentAscOrDesc = $(this).children('option:selected').val();
			//修改提交表单的orderBy
			// $("#ascOrDesc").val(currentAscOrDesc);
			document.forms[0].ascOrDesc.value = currentAscOrDesc;
			//修改页面大小后，再主动查询一次动漫数据
			//将当前页数，重置为1
			// $("#pageNo").val(1);
			document.forms[0].pageNo.value = 1;
			$("#searchForm").submit();
		});

    });
</script>
</html>